<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<script type="text/javascript">
<!--
function filterCategories() {
	var prefix = $('searchBox').value;
	if (prefix == '') {
		var choose = $('chooser');
		while (choose.getElementsByTagName('option').length > 0) {
			choose.removeChild(choose.getElementsByTagName('option')[0]);
		}
		$('chooser').selectedIndex = 0;
	} else {
		new Ajax.Request(
			'${scriptPath}?action=category.ajaxsearch&prefix=' + prefix,
			{
				method : 'get',
				onSuccess : function(transport) {
					var choose = $('chooser');
					while (choose.getElementsByTagName('option').length > 0) {
						choose.removeChild(choose.getElementsByTagName('option')[0]);
					}

					var categoryArr = transport.responseText.evalJSON();
					for (i = 0; i < categoryArr.length; i++) {
						category = categoryArr[i];
						var option = document.createElement('option');
						option.value = category.id;
						option.innerHTML = category.name;
						choose.insertBefore(option, $('noneOption'));
					}
					$('chooser').selectedIndex = 0;
				},
				onFailure: function(){ alert('Something went wrong...') }
			}
		);
	}
}

function filterKey(evt) {
	var theEvent = evt || window.event;
	var key = theEvent.keyCode || theEvent.which;
	key = String.fromCharCode( key );
	var regex = /[0-9]|\./;
	if( !regex.test(key) ) {
	  theEvent.returnValue = false;
	  theEvent.preventDefault();
	}
}

//-->
</script>

<form>
	<input type="hidden" name="action" value="test.create" />
	
	<p>Tên: 
		<input type="text" name="tc_name" value="${param.tc_name}"></input> 
		<c:if test="${!(empty nameErr)}">
			<span style="">${nameErr}</span>
		</c:if>
	</p>
	
	<p>Mô tả: <textarea name="tc_description">${param.tc_description}</textarea>
		<c:if test="${!(empty descriptionErr)}">
			<span style="">${descriptionErr}</span>
		</c:if>
	</p>

	<p>Thể loại:
		<select id="chooser" name="tc_category" size="10">
		</select><br />
		<label>Tìm kiếm: 
			<input type="text" name="tc_searchBox"
				value="${param.tc_searchBox}" id="searchBox"
				onkeydown="setTimeout(filterCategories, 100); return true";></input>
		</label>
		<script type="text/javascript">
			filterCategories();
		</script>
		${categoryErr}
	</p>

	<p>Kiểu:
		<p><label>
			<input type="radio" name="tc_type" value="radio"
					${(empty param.tc_type || param.tc_type=='radio') ? "checked":""}>
			Một câu đúng 
		</label>
		</p>
		<p><label>
			<input type="radio" name="tc_type" value="check"
					${(param.tc_type=='check') ? "checked":""}>
			Nhiều câu đúng 
		</label>
		</p>
	</p>
	
	<p><label>Thời gian
		<input type="text" name="tc_time" onkeypress="filterKey(event)" 
				value='${(empty param.tc_time)?"90":param.tc_time}'></input>
	</label>
	</p>

	<p>
		<button type="submit" name="tc_submit" value="create">Tạo</button>
		<button type="submit" name="tc_submit" value="cancel">Thôi</button>
	</p>
</form>